
.condition-container {
    position: relative;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    background-color: #fff;
   
    .condition-content-container {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        background-color: #fff;
        z-index: 1000;
        width: 100%;
        min-height: 300px;
        display: flex;
        flex-direction: column;
        padding: 0;
        border-bottom:solid 1px  #f0f0f0;
        .header{
            height: 32px;
            margin-left: 12px;
            line-height: 32px;
            h1{
                font-size: 16px;
            }
        }
        .content{
            flex: auto;
            margin: 0 12px;
        }
        .footer{
            height: 32px;
            margin: 12px 0;
            text-align: center;
            button{
                margin: 0 12px;
            }
        }
    }

    .transform-enter {
        transform: translateY(-100%)
    }

    .transform-enter-active {
        transform: translateY(0%);
        transition: transform .3s ease-in-out;
    }

    .transform-exit {
        transform: translateY(0%)
    }

    .transform-exit-active {
        transform: translateY(-100%);
        transition: transform .3s ease-in-out;
    }
}
